<?php
/**
 * 服务条款与隐私政策组件
 * 支持自定义页面标题、背景色、卡片样式及条款内容，可通过配置灵活扩展
 */
$configKey = isset($configKey) ? $configKey : 'privacy';

// 页面文本配置（统一管理可复用文本，便于全局修改）
$texts = [
];

// 默认配置（核心参数+默认条款内容，支持通过customConfig覆盖）
$defaultConfig = [
    'section_id' => $configKey, // 组件唯一ID（结合configKey避免冲突）
    'section_pretitle' => '法律信息',
    'section_title' => '服务条款与隐私政策',
    'section_subtitle' => '了解我们的服务条款和隐私政策，保护您的权益',
    'texts' => $texts, // 引入统一文本配置
    
    // 样式配置
    'bg_color' => 'gray-50', // 背景色（支持Tailwind颜色值）
    'card_style' => 'modern', // 卡片样式：modern(现代)、classic(经典)、minimal(极简)
    
    // 交互配置（可扩展，如是否启用目录导航、滚动高亮等）
    'interaction' => [
        'scroll_animation' => true, // 是否启用条款滚动渐入动画
        'animation_duration' => 0.5, // 动画时长（秒）
    ],
    
    // 核心：条款内容（不可删除，支持通过array_merge自定义）
    'content' => [
        [
            'heading' => '1. 收集的信息',
            'content' => '我们收集您在使用服务过程中主动提供的信息，包括但不限于您的姓名、联系方式和反馈内容。当您访问我们的网站时，我们可能会自动收集某些信息，如您的IP地址、浏览器类型、访问时间和页面浏览记录。我们使用Cookie和类似技术来改善您的体验和分析服务使用情况。'
        ],
        [
            'heading' => '2. 信息使用',
            'content' => '我们收集的信息用于以下目的：提供和改进我们的服务；回应您的反馈和请求；与您沟通服务相关的信息；确保服务的安全性；遵守法律义务。我们不会将您的个人信息用于与本政策所述目的无关的其他用途，除非获得您的明确同意。'
        ],
        [
            'heading' => '3. 信息共享',
            'content' => '我们不会向第三方出售您的个人信息。在以下情况下，我们可能会共享您的信息：获得您的明确同意；为了提供服务而与我们的服务提供商共享（这些提供商受保密义务约束）；遵守法律法规或响应合法请求；保护我们的合法权益、安全或财产，或用户或公众的安全。'
        ],
        [
            'heading' => '4. 信息保护',
            'content' => '我们采取合理的安全措施保护您的个人信息免受未授权访问、使用或披露。这些措施包括技术和组织安全措施，但请注意，没有任何数据传输或存储系统是100%安全的。我们不能保证您的信息绝对安全，但会不断努力改进安全措施。'
        ],
        [
            'heading' => '5. 信息保留',
            'content' => '我们会在实现收集信息的目的所需的期限内保留您的个人信息，除非法律要求或允许更长的保留期。当信息不再需要用于原定目的时，我们会采取合理措施安全销毁或匿名化处理这些信息。'
        ],
        [
            'heading' => '6. 您的权利',
            'content' => '您有权访问、更正或删除我们收集的关于您的个人信息。您也可以随时联系我们，要求限制或反对我们对您信息的处理，或撤回您的同意。如需行使这些权利，请通过我们的联系方式与我们联系。我们将在合理时间内回应您的请求。'
        ],
        [
            'heading' => '7. 政策变更',
            'content' => '我们可能会不时更新本隐私政策。任何变更将在本页面发布后生效。我们会在政策变更重大时，通过适当方式通知您。建议您定期查看本隐私政策，了解我们如何保护您的信息。'
        ]
    ]
];

// 获取页面传入的自定义配置（优先级：页面配置 > 默认配置）
$customConfig = $pageConfig['components']['privacy'] ?? [];

// 合并配置：自定义配置（含content条款内容）覆盖默认配置，未定义项保留默认值
$data = array_merge($defaultConfig, $customConfig);

// 处理样式类（根据配置动态生成，与原逻辑保持一致）
// 1. 背景样式类
$bgClass = "bg-{$data['bg_color']}";

// 2. 卡片样式类（根据card_style映射Tailwind类）
$cardBaseClasses = "p-8 rounded-xl transition-all duration-300";
$cardStyles = [
    'modern' => $cardBaseClasses . " bg-white shadow-md hover:shadow-lg",
    'classic' => $cardBaseClasses . " bg-white border border-gray-200",
    'minimal' => $cardBaseClasses . " bg-transparent"
];
$cardClass = $cardStyles[$data['card_style']] ?? $cardStyles['modern'];
?>

<!-- 服务条款与隐私政策页面 -->
<section id="<?php echo htmlspecialchars($data['section_id']); ?>" class="<?php echo $bgClass; ?> py-16">
    <div class="container mx-auto px-4 sm:px-6 lg:px-8">
        <!-- 区域标题（动态读取配置文本） -->
        <div class="text-center max-w-3xl mx-auto mb-16">
                <span class="inline-block text-sm font-semibold text-blue-600 uppercase tracking-wider mb-2">
                    <?php echo htmlspecialchars($data['section_pretitle'] ?? ''); ?>
                </span>
            
            <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">
                <?php echo htmlspecialchars($data['section_title']); ?>
            </h2>
            
            <p class="text-lg text-gray-600">
                <?php echo htmlspecialchars($data['section_subtitle']); ?>
            </p>
        </div>

        <!-- 条款内容容器（动态读取卡片样式） -->
        <div class="max-w-4xl mx-auto">
            <div class="<?php echo $cardClass; ?>">
                <!-- 条款列表（动态渲染content中的条款内容） -->
                <div class="space-y-8 text-gray-700" id="privacy-terms-container">
                    <?php foreach ($data['content'] as $index => $section): ?>
                        <div 
                            class="term-section" 
                            data-term-section
                            data-section-index="<?php echo $index; ?>"
                            <?php if ($data['interaction']['scroll_animation']): ?>
                                style="opacity: 0; transform: translateY(20px); transition: opacity <?php echo $data['interaction']['animation_duration']; ?>s ease, transform <?php echo $data['interaction']['animation_duration']; ?>s ease;"
                            <?php endif; ?>
                        >
                            <h4 class="text-xl font-semibold mb-3 text-gray-900">
                                <?php echo htmlspecialchars($section['heading']); ?>
                            </h4>
                            <p class="leading-relaxed">
                                <?php echo htmlspecialchars($section['content']); ?>
                            </p>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- 交互脚本（根据配置动态控制功能） -->
<script>
document.addEventListener('DOMContentLoaded', function() {
    // 从PHP配置动态获取参数
    const privacyConfig = {
        scrollAnimation: <?php echo $data['interaction']['scroll_animation'] ? 'true' : 'false'; ?>,
        animationDuration: <?php echo $data['interaction']['animation_duration']; ?>,
        totalSections: <?php echo count($data['content']); ?>
    };

    // 1. 滚动渐入动画（根据配置启用）
    if (privacyConfig.scrollAnimation) {
        // 初始化观察器，监听条款区域进入视口
        const observer = new IntersectionObserver((entries) => {
            entries.forEach(entry => {
                if (entry.isIntersecting) {
                    // 触发动画
                    entry.target.style.opacity = '1';
                    entry.target.style.transform = 'translateY(0)';
                    // 动画完成后停止观察（避免重复触发）
                    observer.unobserve(entry.target);
                }
            });
        }, {
            threshold: 0.1, // 当元素10%进入视口时触发
            rootMargin: '0px 0px -50px 0px' // 底部偏移，优化触发时机
        });

        // 为所有条款区域添加观察
        const termSections = document.querySelectorAll('[data-term-section]');
        termSections.forEach(section => {
            observer.observe(section);
        });
    }

    // 2. 可扩展功能：条款锚点导航（如需添加，可基于配置启用）
    // 示例：若后续需要添加目录导航，可通过配置中的interaction字段控制是否显示
    // if (privacyConfig.showNavigation) {
    //     // 动态生成目录导航逻辑
    // }
});
</script>